<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	<th:block th:include="common/include :: header('新增养修信息预约')" />
</head>
<body class="white-bg">
<<div class="wrapper wrapper-content animated fadeInRight ibox-content">
	<form class="form-horizontal m" id="form-appointment-add">
				<div class="form-group">
						<label class="col-sm-3 control-label">客户姓名：</label>
						<div class="col-sm-8">
							<input name="customerName" class="form-control" type="text" required>
						</div>
				</div>
		        <div class="form-group">
		        	    <label class="col-sm-3 control-label">联系方式：</label>
		        	    <div class="col-sm-8">
		        	    	<input name="customerPhone" class="form-control" type="text" required>
		        	    </div>
		        </div>
		        <div class="form-group">
		        	<label class="col-sm-3 control-label">预约时间：</label>
		        	<div class="col-sm-8">
		        		<div class="input-group date">
		        		 <input name="appointmentTime" class="form-control" placeholder="yyyy-MM-dd HH:mm" type="text" required>
		        		 <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
		        	    </div>
		        	</div>
		        </div>
		        <div class="form-group">
		        	<label class="col-sm-3 control-label">车牌号码：</label>
		        	<div class="col-sm-8">
		        		<input name="licensePlate" class="form-control" type="text" required>
		        	</div>
		        </div>
		        <div class="form-group">
		        	<label class="col-sm-3 control-label">汽车类型：</label>
		        	<div class="col-sm-8">
		        		<input name="carSeries" class="form-control" type="text" required>
		        	</div>
		        </div>
		        <div class="form-group">
		        	<label class="col-sm-3 control-label">服务类型：</label>
		        	<div class="col-sm-8">
		        		<select name="serviceType" th:with="items=${@dict.getType('cmi_service_type')}">
		        			<option value="">所有</option>
		        			<option th:each="item : ${items}" th:text="${item.label}" th:value="${item.value}"></option>
		        		</select>
		        	</div>
		        </div>
		        <div class="form-group">
		        	<label class="col-sm-3 control-label">备注信息：</label>
		        	<div class="col-sm-8">
		        		<textarea name="info" class="form-control"></textarea>
		        	</div>
		        </div>
	      </form>
     </div>
</div>
<th:block th:include="common/include :: footer" />
<th:block th:include="common/include :: datetimepicker" />
<script th:inline="javascript">
	var prefix= ctx+"/business/appointment";
	$("#form-appointment-add").validate({
		rules:{
			customerPhone:{
				isPhone:true
			}
		},
		messages: {
			"customerPhone":"手机格式不正确"
		},
		focusCleanup: true
	});
	function submitHandler() {
        if ($.validate.form()) {
        	$.operate.save(prefix+"/add",$('#form-appointment-add').serialize());
		}
	}
    $("input[name='appointmentTime']").datetimepicker({
		format:"yyyy-mm-dd hh:ii",
		autoclose:true
	});
</script>
</body>
</html>